<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>

<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>

<!-- VERSION DE HTML5 -->
<!DOCTYPE html>

<html lang="es">
	<!-- CONFIGURACION DE LA PAGINA WEB ACTUAL -->
	<head>
		<!-- GENERAL's -->
		<title>Sistema Entretenimiento</title>

		<!-- META's -->
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
		<meta name="apple-mobile-web-app-capable" content="yes">
		<meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=0">

		<!-- LINK's -->
		<link type="text/css" rel="stylesheet" href="resources/css/bootstrap.min.css">
		<link type="text/css" rel="stylesheet" href="resources/css/styles-general.css">
	</head>

	<!-- CONTENIDO DE LA PAGINA WEB ACTUAL -->
	<body>
		<div class="container">
		<div id="loginbox" style="margin-top:50px;" class="mainbox col-md-6 col-md-offset-3 col-sm-8 col-sm-offset-2">
		<div class="panel panel-info" >	
		<!-- ENCABEZADO -->
		<div class="panel-heading">
			<div class="panel-title">Registrarse</div>
			<div style="float:right; font-size: 80%; position: relative; top:-10px"><a href="index.jsp">Ingresar</a></div>
		</div>
		
		<!-- CUERPO DE PAGINA -->
		<div style="padding-top:30px" class="panel-body" >
				<form class="form-horizontal" role="form" method="post" action="PersonaGuardar_Serlvet">
				
					<fieldset>
						<legend>Nuevo Usuario							
							<span class="error">
								<c:if test="${not empty error }">
									<c:out value="${error }"></c:out>
								</c:if>
							</span>
							<span class="success">
								<c:if test="${not empty success }">
									<c:out value="${success }"></c:out>
								</c:if>
							</span>							
						</legend>										
						<div class="form-group">
			  				<label class="col-xs-4" for="nombre">Nombres :</label>
			  				<div class="col-xs-8">
			  					<input type="text" class="form-control" name="nombre" id="nombre" placeholder="Ingrese su nombre" value="${nombre }" required>
			  				</div>
						</div>
						<div class="form-group">
			  				<label class="col-xs-4" for="apePaterno">Ape. Paterno :</label>
			  				<div class="col-xs-8">
			  					<input type="text" class="form-control" name="apePaterno" id="apePaterno" placeholder="Ingrese su apellido paterno" value="${apePaterno }" required>
			  				</div>
						</div>
						<div class="form-group">
			  				<label class="col-xs-4" for="apeMaterno">Ape. Materno :</label>
			  				<div class="col-xs-8">
			  					<input type="text" class="form-control" name="apeMaterno" id="apeMaterno" placeholder="Ingrese su apellido materno" value="${apeMaterno }" required>
			  				</div>
						</div>
						<div class="form-group">					
			  				<label class="col-xs-4" for="tipoDocumento">Tipo Documento :</label>
			  				<div class="col-xs-8">
			  					<div class="col-xs-6">
					  				<select class="form-control" id="tipoDocumento" name="tipoDocumento">
					  					<c:if test="${not empty listTipoDocumento }">
					  						<c:forEach items="${listTipoDocumento }" var="item" varStatus="index">
					  							<c:if test="${tipoDocumento eq item.idTipoDocumento }">
					  								<c:set var="tipDoc" value="selected"/>
					  							</c:if>
					  							<c:if test="${tipoDocumento ne item.idTipoDocumento }">
					  								<c:set var="tipDoc" value=""/>
					  							</c:if>
					  							<option value="${item.idTipoDocumento }" ${tipDoc }>${item.descripcion }</option>
					  						</c:forEach>
					  					</c:if>				  					
					  				</select>
				  				</div>
				  				<div class="col-xs-6">
				  					<input type="number" min="0" class="form-control" name="nroDocumento" id="nroDocumento" placeholder="Nro. documento" value="${nroDocumento }" required>
				  				</div>
				  			</div>
						</div>
						<div class="form-group">
			  				<label class="col-xs-4" for="sexo">Sexo :</label>
			  				<div class="col-xs-8">			  				
				  				<div class="btn-group" data-toggle="buttons">
				  					<c:if test="${sexo == 'M' }">
				  						<c:set var="sexoM" value="active"/>
				  					</c:if>
				  					<c:if test="${sexo == 'F' }">
				  						<c:set var="sexoF" value="active"/>
				  					</c:if>
					                <label class="btn btn-default ${sexoM }">
					                    <input type="radio" name="sexo" value="M"> M
					                </label>
					                <label class="btn btn-default ${sexoF }">
					                    <input type="radio" name="sexo" value="F"> F
					                </label> 							               
	           					</div>
	           				</div>
						</div>
						<div class="form-group">
			  				<label class="col-xs-4" for="celular">Celular :</label>
			  				<div class="col-xs-8">
			  					<input type="text" class="form-control" name="celular" id="celular" placeholder="Ingrese su nro. celular" value="${celular }">
			  				</div>
						</div>
						<div class="form-group">
			  				<label class="col-xs-4" for="correo">Correo :</label>
			  				<div class="col-xs-8">
			  					<input type="email" class="form-control" name="correo" id="correo" placeholder="Ingrese su correo electronico" value="${correo }" required>
			  				</div>
						</div>
						<div class="form-group">
			  				<label class="col-xs-4" for="contrasena">Contraseña :</label>
			  				<div class="col-xs-8">
			  					<input type="password" class="form-control" name="contrasena" id="contrasena" placeholder="Ingrese su contraseña" required>
			  				</div>
						</div>
						<div class="form-group">
			  				<label class="col-xs-4" for="confcontrasena">Conf. Contraseña :</label>
			  				<div class="col-xs-8">
			  					<input type="password" class="form-control" name="confcontrasena" id="confcontrasena" placeholder="Ingrese su conf. contraseña" required>
			  				</div>
						</div>
						<div class="form-group">
			  				<label class="col-xs-4" for="direccion">Dirección :</label>
			  				<div class="col-xs-8">
			  					<input type="text" class="form-control" name="direccion" id="direccion" placeholder="Ingrese su dirección" value="${direccion }">
			  				</div>
						</div>
						<div class="form-group">
							<div class="col-sm-offset-2 col-sm-10">
								<button type="submit" class="btn btn-info">Grabar Registro</button>
								<a href="index.jsp" class="btn btn-danger">Regresar</a>
							</div>							
						</div>
					</fieldset>
				</form>
			
			</div>
		</div>
		</div>	
	</div><!-- Fin Container -->	

		<!-- SCRIPT's -->
		<script type="text/javascript" src="resources/js/jquery-1.11.1.min.js"></script>
		<script type="text/javascript" src="resources/js/bootstrap.min.js"></script>
		<script type="text/javascript" src="resources/js/scripts-general.js"></script>
	</body>
</html>